<template>
    <div class="time">
        <div id="container" style="min-width:400px;height:400px" v-loading="loading"
    element-loading-text="拼命加载中"
    element-loading-spinner="el-icon-loading"
    element-loading-background="rgba(0, 0, 0, 0.8)"></div>
    </div>
</template>

<script>
import axios from '@/http/axios'
export default {
    data(){
        return{
            loading:true,
            tableData:[],
            list_data:[],
            params:{
                page:1,
                pageSize:10000
            }
        }
        
    },
    mounted(){
        setTimeout(()=>{
            this.init()
        },3000)
    },
    created(){
        this.Find()
    },
    methods:{
        Find(){
            axios({
                url:'http://121.199.29.84:8001/epidemic/pageQuery',
                method:'get',
                params:this.params
            }).then((res)=>{
                var GD_confirmed=0
                var GX_confirmed=0
                var FJ_confirmed=0
                var JX_confirmed=0
                var HN_confirmed=0
                var GZ_confirmed=0
                var YN_confirmed=0
                var ZJ_confirmed=0
                var SH_confirmed=0
                var AH_confirmed=0
                var HB_confirmed=0
                var BJ_confirmed=0
                // 表格数据
                this.tableData = res.data.data.list
                // console.log(res.data.data.list)
                var a = []
                res.data.data.list.forEach((item)=>{
                    if(item.province == "广东省"){
                        GD_confirmed += item.confirmed
                    }else if(item.province == "广西壮族自治区"){
                        GX_confirmed += item.confirmed
                    }else if(item.province == "福建省"){
                        FJ_confirmed += item.confirmed
                    }else if(item.province == "江西省"){
                        JX_confirmed += item.confirmed
                    }else if(item.province == "湖南省"){
                        HN_confirmed += item.confirmed
                    }else if(item.province == "贵州省"){
                        GZ_confirmed += item.confirmed
                    }else if(item.province == "云南省"){
                        YN_confirmed += item.confirmed
                    }else if(item.province == "浙江省"){
                        ZJ_confirmed += item.confirmed
                    }else if(item.province == "上海市"){
                        SH_confirmed += item.confirmed
                    }else if(item.province == "安徽省"){
                        AH_confirmed += item.confirmed
                    }else if(item.province == "湖北省"){
                        HB_confirmed += item.confirmed
                    }else if(item.province == "北京市"){
                        BJ_confirmed += item.confirmed
                    }
                })
                this.list_data.push(GD_confirmed,GX_confirmed,FJ_confirmed,JX_confirmed,HN_confirmed,
                GZ_confirmed,YN_confirmed,ZJ_confirmed,SH_confirmed,AH_confirmed,HB_confirmed,BJ_confirmed)
            })
        },
        init(){
            var chart = Highcharts.chart('container', {
            chart: {
                type: 'spline'
            },
            title: {
                text: '中国疫情展示'
            },
            subtitle: {
                text: '数据来源: 中国疾控中心'
            },
            xAxis: {
                categories: ['广东', '广西', '福建', '江西', '湖南', '贵州',
                            '云南', '浙江', '上海', '安徽', '湖北', '北京']
            },
            yAxis: {
                title: {
                    text: '部分省份累计患病人数'
                },
                labels: {
                    formatter: function () {
                        return this.value;
                    }
                }
            },
            tooltip: {
                crosshairs: true,
                shared: true
            },
            plotOptions: {
                spline: {
                    marker: {
                        radius: 4,
                        lineColor: '#666666',
                        lineWidth: 1
                    }
                }
            },
            series: [{
                name: '中国',
                marker: {
                    symbol: 'square'
                },
                data: this.list_data
            }]
        });

        }
    }
}
</script>